<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<script src="<c:url value='/js/jquery.form.js'/>"></script>
<script type="text/javascript">
	$(document).ready(function() {
		var options = {
			success : function(data) {
				$("#working-area").html(data);
			}
		};
		$("#add-user-project-form").ajaxForm(options);
		$("#delete-user-project-form").ajaxForm(options);

		$("#add-user-project-form").hide();
	});
	function showForm() {
		$("#add-user-project-form").toggle();
	}
	function valid(){
		var result = false;
		$("input[name='userProjectId']").each(function(){
	          if ($(this).is(":checked") == true ){
	                result = true;
	          }
		});
		if (result != true) alert("No one selected!");
		return result;
	}
	
</script>

<div class="page-header">
	<ul class="breadcrumb">
		<li>
			<h3 style="margin-top: auto">
				<c:out value="${pgroup.name}"></c:out>
				<span class="divider">/</span>
			</h3>
		</li>
		<li class="active"><h3>
				<a href="javascript:void(0);"><c:out value="${project.name}"></c:out></a> 
			</h3>
		</li>
	</ul>
</div>
<div class="row-fluid">

	<div class="span9">

		<form id="delete-user-project-form" action="/ManEnv/userProject/delete"
			method="post" onsubmit="return valid()">
			<input type="hidden" name="projectId" value="${projectId}" />
			<div class="control-group ">
				<label class="control-label" for=""><h4><strong>项目成员</strong></h4></label>
				<div class="controls">
					<button type="button" class="btn-default" onclick="showForm()">
						<i class="icon-plus"></i>&nbsp;添加用户
					</button>
					<button type="submit" class="btn-default">
						<i class="icon-remove"></i>&nbsp;删除用户
					</button>
				</div>
			</div>
			<table class="table table-hover">
				<thead>
					<tr>
						<th>#</th>
						<th>用户名</th>
						<th>角色</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${userProjects}" var="userProject">
						<tr>
							<td><label class="checkbox">
							     <input type="checkbox" name="userProjectId" value="${userProject.id}"/>
							</label></td>
							<td>${userProject.user.username}
							</td>
							<td>
							     <c:choose>
									<c:when test='${userProject.admin}'>管理者</c:when>
									<c:otherwise>参与者</c:otherwise>
								</c:choose>
							</td>
						</tr>
					</c:forEach>
				</tbody>
				<tfoot>
				</tfoot>
			</table>
		</form>
		<form id="add-user-project-form" action="/ManEnv/userProject/add"
			method="post">
			<input type="hidden" name="projectId" value="${projectId}" />
			<h4>添加项目成员</h4>
			<div class="control-group">
				<div class="controls">
					<select name="userId">
						<c:forEach items="${users}" var="user">
							<option value="${user.id}"><c:out
									value="${user.username}"></c:out></option>
						</c:forEach>
					</select>
				</div>
			</div>
			<div class="control-group">
				<div class="controls">
					<select name="admin">
						<option value="true">管理者</option>
						<option value="false">参与者</option>
					</select>
				</div>
			</div>
			<div class="control-group">
				<div class="controls">
					<button type="submit" class="btn" id="submit" onclick="">
						<i class="icon-ok"></i>&nbsp;确认
					</button>
					<button type="button" class="btn" onclick="">
						<i class="icon-remove"></i>&nbsp;取消
					</button>
				</div>
			</div>
		</form>
	</div>

</div>